<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

<head>
    
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>Home</title>

    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"/>
    <link rel="stylesheet" href="assets/materialize/css/materialize.min.css" media="screen,projection"/>
    <!-- Bootstrap Styles-->
    <link href="assets/css/bootstrap.css" rel="stylesheet"/>
    <!-- FontAwesome Styles-->
    <link href="assets/css/font-awesome.css" rel="stylesheet"/>
    <!-- Morris Chart Styles-->
    <link href="assets/js/morris/morris-0.4.3.min.css" rel="stylesheet"/>
    <!-- Custom Styles-->
    <link href="assets/css/custom-styles.css" rel="stylesheet"/>
    <!--&lt;!&ndash; Google Fonts&ndash;&gt;-->
    <!--<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'/>-->
    <!--<link rel="stylesheet" href="assets/js/Lightweight-Chart/cssCharts.css">-->
</head>

<body>

<div id="wrapper">
    <nav class="navbar navbar-default top-navbar" role="navigation">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle waves-effect waves-dark" data-toggle="collapse"
                    data-target=".sidebar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand waves-effect waves-dark" th:href="@{/}"><i
                    class="large material-icons">insert_chart</i>
                <strong>Lger 会员系统</strong></a>

            <div id="sideNav" href=""><i class="material-icons dp48">toc</i></div>
        </div>
        <!--用户登录信息-->
        <ul class="nav navbar-top-links navbar-right">
            <li><a class="dropdown-button waves-effect waves-dark" href="#" data-activates="dropdown1"><i
                    class="fa fa-user fa-fw"></i> <b th:unless="${session.admin == null}" th:text="${session.admin.username}"></b> <i
                    class="material-icons right">arrow_drop_down</i></a></li>
        </ul>
    </nav>
    <!--用户登录栏的具体信息-->
    <ul id="dropdown1" class="dropdown-content">
        <li><a th:href="@{/myAccount}"><i class="fa fa-user fa-fw"></i>我的账户</a>
        </li>
        <li><a th:href="@{/logout}"><i class="fa fa-sign-out fa-fw"></i>退出登录</a>
        </li>
    </ul>
    <!--侧边栏-->
    <nav class="navbar-default navbar-side" role="navigation">
        <div class="sidebar-collapse">
            <ul class="nav" id="main-menu">

                <li>
                    <a class="waves-effect waves-dark" th:href="@{/}"><i class="fa fa-dashboard"></i>
                        首页</a>
                </li>
                <!--会员管理栏-->
                <li>
                    <a href="javascript:void(0)" class="waves-effect waves-dark"><i class="fa fa-user"></i>会员管理<span
                            class="fa arrow"></span></a>
                    <ul class="nav nav-second-level">
                        <li>
                            <a th:href="@{/addMember}">添加会员</a>
                        </li>
                        <li>
                            <a th:href="@{/queryMember}">查询会员</a>
                        </li>
                        <li>
                            <a th:href="@{/memberGrade}">会员类别</a>
                        </li>
                        <li>
                            <a th:href="@{/modifyMemberState}">会员状态修改</a>
                        </li>

                        <li>
                            <a href="#">会员消费<span class="fa arrow"></span></a>
                            <ul class="nav nav-third-level" aria-expanded="true">
                                <li>
                                    <a th:href="@{/integralExchange}">积分兑换</a>
                                </li>
                                <li>
                                    <a th:href="@{/balanceRecharge}">余额充值</a>
                                </li>
                            </ul>

                        </li>

                        <li>
                            <a th:href="@{/deleteMember}">会员注销</a>
                        </li>
                    </ul>
                </li>
                <!--礼品栏-->
                <li>
                    <a href="javascript:void(0)" class="waves-effect waves-dark"><i class="fa fa-gift"></i>礼品消费<span
                            class="fa arrow"></span></a>
                    <ul class="nav nav-second-level">
                        <li>
                            <a th:href="@{/setGift}">礼品设置</a>
                        </li>

                        <li>
                            <a th:href="@{/modifyGiftNumber}">数量修改</a>
                        </li>

                        <li>
                            <a th:href="@{/exchangeRecord}">兑换记录</a>
                        </li>
                    </ul>
                </li>
                <!--商品消费-->
                <li class="active">
                    <a href="javascript:void(0)" class="active-menu waves-effect waves-dark"><i class="fa fa-yen"></i>商品消费<span
                            class="fa arrow"></span></a>
                    <ul class="nav nav-second-level collapse in"  aria-expanded="true">
                        <li>
                            <a class="active-menu" th:href="@{/addCommodity}">添加商品</a>
                        </li>

                        <li>
                            <a th:href="@{/modifyCommodity}">商品修改</a>
                        </li>

                        <li>
                            <a th:href="@{/purchaseCommodity}">商品购买</a>
                        </li>

                        <li>
                            <a th:href="@{/transactionRecord}">积分记录</a>
                        </li>
                    </ul>
                </li>

                <li>
                    <a class="waves-effect waves-dark" th:href="@{/birthdayWarning}"><i class="fa fa-birthday-cake"></i>
                        生日提醒</a>
                </li>

                <li>
                    <a class="waves-effect waves-dark" th:href="@{/integralLottery}"><i class="fa fa-star"></i>
                        积分抽奖</a>
                </li>
            </ul>

        </div>

    </nav>
    <!--内容主体-->
    <div id="page-wrapper">
        <!--内容主题-->
        <div class="header">
            <h1 class="page-header">
                添加商品
            </h1>
        </div>
        <div id="page-inner">
            <!--自定义内容-->
            <!--<div class="container">-->
                <div class="card">
                    <div class="card-content">
                        <div class="row">
                            <div class="input-field col s6">
                                <input placeholder="商品名" id="commodityName" type="text" class="validate" name="commodityName" required/>
                                <label for="commodityName">商品名</label>
                            </div>
                            <div class="input-field col s6">
                                <input id="commodityIntegral" onblur="confirmNumAndIntegral()" name="commodityIntegral" type="text" class="validate" placeholder="购买后可获取商品积分" required/>
                                <label for="commodityIntegral">购买后可获取商品积分</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="input-field col s6">
                                <input placeholder="商品数量" onblur="confirmNumAndIntegral()" id="commodityNumber" type="text" class="validate" name="commodityNumber" required/>
                                <label for="commodityNumber">商品数量</label>
                            </div>
                            <div class="input-field col s6">
                                <input id="commodityPrice" onchange="confirmPrice()" name="commodityPrice" type="text" class="validate" placeholder="商品价格" required/>
                                <label for="commodityPrice">商品价格</label>
                            </div>
                        </div>
                    </div>
                    <div class="card-action">
                        <a href="javascript:void(0)" onclick="addCommodity()">添加商品</a>
                    </div>
                <!--</div>-->
            </div>

            <!--页脚-->
            <br>
            <br>
            <br>
            <footer><p class="text-center">Copyright &copy; 2017.Company name All rights reserved.</p></footer>
        </div>

    </div>
</div>

<!-- JS Scripts-->
<!-- jQuery Js -->
<script src="assets/js/jquery-1.10.2.js"></script>

<!-- Bootstrap Js -->
<script src="assets/js/bootstrap.min.js"></script>

<script src="assets/materialize/js/materialize.min.js"></script>

<!-- Metis Menu Js -->
<script src="assets/js/jquery.metisMenu.js"></script>

<script src="assets/js/easypiechart.js"></script>
<script src="assets/js/easypiechart-data.js"></script>

<script src="assets/js/Lightweight-Chart/jquery.chart.js"></script>

<!-- Custom Js -->
<script src="assets/js/custom-scripts.js"></script>

<script>

    function confirmPrice() {
        var reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/;
        var obj = document.getElementById('commodityPrice');
        if (!reg.test(obj.value)){
            obj.setAttribute('class', 'validate invalid');
            alert('输入的价格不符合要求');
            return false;
        }
        return true;
    }
    
    function confirmNumAndIntegral() {
        var reg = /^\d+$/;
        var obj1= document.getElementById('commodityNumber');
        var obj2 = document.getElementById('commodityIntegral');
        if (!reg.test(obj1.value)){
            if (obj1.value === ''){
                return false;
            }
            obj1.setAttribute('class', 'validate invalid');
            alert('输入的数量不符合要求');
            return false;
        }
        if (!reg.test(obj2.value)){
            if (obj2.value === ''){
                return false;
            }
            obj2.setAttribute('class', 'validate invalid');
            alert('输入的积分不符合要求');
            return false;
        }
        return true;
    }
    
    function addCommodity() {
        if (confirmPrice() && confirmNumAndIntegral())
        if (confirm('确认添加该商品吗？')) {
            var obj1= document.getElementById('commodityNumber').value;
            var obj2 = document.getElementById('commodityIntegral').value;
            var obj3 = document.getElementById('commodityPrice').value;
            var obj4 = document.getElementById('commodityName').value;
            $.ajax({
                url: '/addCommodity',
                type: 'POST',
                data: {commodityNumber: obj1, commodityIntegral:obj2,commodityPrice:obj3 ,commodityName:obj4},
                success: function (data) {
                    alert(data);
                }
            })
        }
    }

</script>
</body>

</html>